<template>
	<button @click="handleClick" :style="styles">
		<slot></slot>
	</button>
</template>
<script>
	export default{
		props: {
			color: {
				type: String,
				default: '#00cc66'
			}
		},
		computed: {
			styles(){
				return {
					background: this.color
				}
			}
		},
		methods: {
			handleClick(e){
				this.$emit('click',e);
			}
		}
	}
</script>
<style scoped>
	button{
		border: 0;
		outline: none;
		color: #fff;
		padding: 4px 8px;
	}
	button:active{
		position: relative;
		top:1px;
		left:1px;
	}
</style>